<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>二十四节气</title>
    <link href="css/index.css" rel="stylesheet" type="text/css">
</head>
<body>
    <div class="container">
        <div class=" header1">二十四节气</div>
        <div class="top-section">
            <div class="left">
                <div class="big-text">春</div>
                <div class="big-text1">SPRING</div>
            </div>
            <div class="middle">
                <a href="lichun.html"><div class="middle-top">
                    <div>立春</div>
                    <div>Spring Begins</div>
                </div></a>
                <a href="jingzhe.html"><div class="middle-top middle-bottom">
                    <div>惊蛰</div>
                    <div>Inserts Awakens</div>
                </div></a>
            </div>
            <div class="right">
                <a href="yushui.html"><div class="middle-top">
                    <div>雨水</div>
                    <div>The Rains</div>
                </div></a>
                <a href="chunfen.html"><div class="middle-top middle-bottom">
                    <div>春分</div>
                    <div>Vernal Equinox</div>
                </div></a>
            </div>
            <div class="right">
                <a href="qingming.html"><div class="middle-top">
                    <div>清明</div>
                    <div>Clear and Bright</div>
                </div></a>
                <div class="middle-top middle-bottom">
                    <div>谷雨</div>
                    <div>Grain Rain</div>
                </div>
            </div>
        </div>
        <div class="top-section">
            <div class="left left1">
                <div class="big-text">夏</div>
                <div class="big-text1">SUMMER</div>
            </div>
            <div class="middle">
                <div class="middle-top middle-top1">
                    <div>立夏</div>
                    <div>Summer Begins</div>
                </div>
                <div class="middle-top middle-top1 middle-bottom">
                    <div>小满</div>
                    <div>Grain Buds</div>
                </div>
            </div>
            <div class="right">
                <div class="middle-top middle-top1">
                    <div>芒种</div>
                    <div>Grain in Ear</div>
                </div>
                <div class="middle-top middle-top1 middle-bottom">
                    <div>夏至</div>
                    <div>Summer Solstice</div>
                </div>
            </div>
            <div class="right">
                <div class="middle-top middle-top1">
                    <div>小暑</div>
                    <div>Little Heat</div>
                </div>
                <div class="middle-top middle-top1 middle-bottom">
                    <div>大暑</div>
                    <div>Big Heat</div>
                </div>
            </div>
        </div>
        <div class="top-section">
            <div class="left left2">
                <div class="big-text">秋</div>
                <div class="big-text1">AUTUMN</div>
            </div>
            <div class="middle">
                <div class="middle-top middle-top2">
                    <div>立秋</div>
                    <div>AUTUMN Begins</div>
                </div>
                <div class="middle-top middle-top2 middle-bottom">
                    <div>处暑</div>
                    <div>Heat Treatment</div>
                </div>
            </div>
            <div class="right">
                <div class="middle-top middle-top2">
                    <div>白露</div>
                    <div>White Dew</div>
                </div>
                <div class="middle-top middle-top2 middle-bottom">
                    <div>秋分</div>
                    <div>Autumnal Equinox</div>
                </div>
            </div>
            <div class="right">
                <div class="middle-top middle-top2">
                    <div>寒露</div>
                    <div>Cold Dew</div>
                </div>
                <div class="middle-top middle-top2 middle-bottom">
                    <div>霜降</div>
                    <div>First Frost</div>
                </div>
            </div>
        </div>
        <div class="top-section">
            <div class="left left3">
                <div class="big-text">冬</div>
                <div class="big-text1">WINTER</div>
            </div>
            <div class="middle">
                <div class="middle-top middle-top3">
                    <div>立冬</div>
                    <div>Winter Begins</div>
                </div>
                <div class="middle-top middle-top3 middle-bottom">
                    <div>小雪</div>
                    <div>Light Snow</div>
                </div>
            </div>
            <div class="right">
                <div class="middle-top middle-top3">
                    <div>大雪</div>
                    <div>Heavy Snow</div>
                </div>
                <div class="middle-top middle-top3 middle-bottom">
                    <div>冬至</div>
                    <div>Winter Solstice</div>
                </div>
            </div>
            <div class="right">
                <div class="middle-top middle-top3">
                    <div>小寒</div>
                    <div>Slight Cold</div>
                </div>
                <div class="middle-top middle-top3 middle-bottom">
                    <div>大寒</div>
                    <div>Great Cold</div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>